{extend name="common/dialog" /}
{block name="main"}
<div class="admin-main fadeInUp animated" ng-app="hd" ng-controller="ctrl">
    <div class="layui-form-box dialog-form-box" style="margin-top:25px;">
    <form class="layui-form ">
        <input type="hidden" name="id" value="{$row['id']}">
        <div class="layui-form-item">
            <label class="layui-form-label" >{:lang('Name')}</label>
            <div class="layui-input-6">
                <input type="text" name="name" value="{$row['name']}"  lay-verify="required" placeholder="{:lang('Please enter the POP name')}" class="layui-input">
            </div>
        </div>
        <div class="layui-form-item">
            <label class="layui-form-label" >{:lang('Region')}</label>
            <div class="layui-input-inline" style="width: 175px;">
              <select name="area_id" lay-verify="required" id="area_id" lay-filter="countryId" data-aid="{:intval($row['city_id'])}" data-value="{$row['area_id']|intval}" data-id="#city_id">
            <option value="">{:lang('Please Choose')}</option>
                <?php foreach($areas as $area):?>
                <option value="{$area['id']}" <?php if($row['area_id'] == $area['id']){echo "selected"; }?>>{$area['name']}</option>
                <?php endforeach;?>
          </select>
            </div>
            <div class="layui-input-inline" style="width: 175px;">
               <select name="city_id" id="city_id" lay-verify="required" data-value="{:intval($row['city_id'])}">
                <option value="">{:lang('Please choose the city')}</option>
            
          </select>
            </div>

        </div>
        <div class="layui-form-item">
            <label class="layui-form-label">{:lang('Address')}</label>
            <div class="layui-input-6">
                <input type="text" name="address" value="{$row['address']}"  placeholder="{:lang('Please input address')}" class="layui-input">
            </div>
        </div>
        <br />
        <br/>
        <div class="layui-form-item">
            <label class="layui-form-label layui-form-label-no" ></label>
            <div class="layui-input-6 pleft22">
                <button type="button" class="layui-btn" lay-submit="" lay-filter="submit">{:lang('Submit')}</button>
            </div>
        </div>
        
    </form>
</div>
</div>
{/block}
{block name="footer"}
<script>
    var m = angular.module('hd',[]);
    m.controller('ctrl',['$scope',function($scope) {
        //$scope.field = '{$info}'!='null'?{$info}:{name:''};
        layui.use(['form', 'layer'], function () {
            var form = layui.form, layer = layui.layer,$= layui.jquery;
            form.on('submit(submit)', function (data) {
                loading = layer.load(1,{shade:[0.1,'#fff']});
                // 提交到方法 默认为本身
                //data.field.id = $scope.field.id;
                $.post("", data.field, function (res) {
                    layer.close(loading);
                    if (res.code > 0) {
                        layer.msg(res.msg, {time: 1800, icon: 1}, function () {
                            location.href = res.url;
                        });
                    } else {
                        layer.msg(res.msg, {time: 1800, icon: 2});
                    }
                });
            })
            /*本端pop点切换*/
            form.on("select(countryId)",function(obj){
                var doem = obj.elem.dataset.id;
                var value = obj.elem.dataset.aid;
                loading = layer.load(1,{shade:[0.1,'#fff']});
                $.post("{:U('area/lists')}",{pid:obj.value},function(res){
                    $(doem).html("<option value=''>{:lang('Please Choose')}</option>");
                    layer.close(loading);
                    if(res.code == 1){
                        $.each(res.items,function(i,item){
                            if(value == item.id){
                                $(doem).append("<option value='"+item.id+"' selected >"+item.name+"</option")
                            }else{
                                $(doem).append("<option value='"+item.id+"'>"+item.name+"</option")
                            }
                            
                        })
                    }
                    form.render();
                },'json')
            });
            if($("#area_id").data('value') != 0){
                var _doem = $("#city_id");
                var _var = $("#city_id").data('value');
                $.post("{:U('area/lists')}",{pid:$("#area_id").data('value')},function(res){
                    if(res.code == 1){
                        $.each(res.items,function(i,item){
                            if(_var == item.id){
                                _doem.append("<option value='"+item.id+"' selected >"+item.name+"</option")
                            }else{
                                _doem.append("<option value='"+item.id+"'>"+item.name+"</option")
                            }
                            
                        })
                    }
                    form.render();
                },'json')
            }
        });
        
    }]);
</script>
{/block}